body {
    /*选择字体，依次按顺序备选字体*/
    font: 14px/1.5 Helvetica Neue, Helvetica, Arial, Microsoft Yahei, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, sans-serif;
    color: #333;
    background-color: #fff;
    /*不设置这里将会导致网页宽度随浏览器大小而改变 导航栏上面的黑条只有浏览器的长度而不是全部能够覆盖导航栏长度*/
    min-width: 1226px
}

a {
    text-decoration-line: none;
}

input[type=search] {
    -webkit-appearance: textfield;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

/*导航栏*/
.nav {
    /*相对定位*/
    position: relative;
    /*Z-index 仅能在定位元素上奏效（例如 position:absolute，relative;）！让该控件浮在最上面  值越大 越在上面*/
    z-index: 30;
    height: 40px;
    font-size: 12px;
    color: #b0b0b0;
    background: #333
}

/*设置全局宽度*/
.container {
    width: 1226px;
    margin-right: auto;
    margin-left: auto;
}


/*导航栏下a标签属性*/
.nav a, .nav span {
    /*浮动 让所有元素横向排列*/
    float: left;
    /*转换成行内块元素而不是 直接block*/
    display: inline-block;
    /*行高设置撑起来 而不是height*/
    line-height: 40px;
    color: #b0b0b0;
    /*文本剧中显示*/
    text-align: center;
    margin: 0 2px;
}

.nav a:hover {
    color: #9715a2;
}

/*整体向右浮动*/
.info, .cart {
    float: right;
}

/*导航栏下a标签属性*/
.info a, .info span {
    position: relative;
    /*内容向左浮动 让所有元素横向排列*/
    float: left;
    /*转换成行内块元素而不是 直接block*/
    display: inline-block;
    /*行高设置撑起来 而不是height*/
    line-height: 40px;
    color: #b0b0b0;
    /*文本剧中显示*/
    text-align: center;
    margin: 0 2px;
}

.cart a .cart span {
    position: relative;
    /*内容向左浮动 让所有元素横向排列*/
    float: right;
    /*转换成行内块元素而不是 直接block*/
    display: inline-block;
    /*行高设置撑起来 而不是height*/
    line-height: 40px;
    color: #b0b0b0;
    /*文本剧中显示*/
    text-align: center;
    margin: 0 2px;
}

/*头部导航*/
.header-nav, .header-logo {
    float: left;
}

.header-nav {
    width: 850px
}

.header-nav .nav-category, .header-nav .nav-item {
    float: left;
}

/*图标大小56所以距上面22px 下面自然也是22px*/
.header-logo {
    float: left;
    width: 62px;
    margin-top: 22px
}

.header-logo .logo {
    position: relative;
    display: block;
    width: 56px;
    height: 56px;
    overflow: hidden
}

.header-logo .logo:after, .header-logo .logo:before {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 56px;
    height: 56px;
    content: "";
    background: url(https://s02.mifile.cn/assets/static/image/logo-mi2.png) no-repeat;
    background-size: 56px;
}


/*全部分类*/
.nav-category {
    /*相对定位然后浮动起来*/
    position: relative;
    float: left;
    display: block;
    padding-right: 15px;
    width: 127px;
}

/*全部分类下的a标签*/
.nav-category .link-category {
    display: block;
    padding: 26px 0 38px;
    text-align: right;
    color: #333
}

/*分类列表*/
.nav-list {
    position: relative;
    z-index: 10;
    float: left;
    width: 1100px;
    height: 88px;
    margin: 0;
    /*图标宽度62 加上padding30 再加上全部分类的总长度（127+15）得到全部宽度234px */
    padding: 12px 0 0 30px;
    list-style-type: none;
    font-size: 16px
}

.nav-item .link {
    display: block;
    /*上左右下  上面已经padding12px 所以是26px 和下面38px一样 */
    padding: 26px 10px 38px;
    color: #333;
}

/*全部分类子分类*/

/***分类列表整体样式***/
.site-category {
    /*绝对定位子绝父相*/
    position: absolute;
    top: 88px;
    left: -92px;
    z-index: 21;
    width: 234px;
    height: 460px;
    font-size: 14px;
}

.site-category-list {
    height: 418px;
    margin: 0;
    /*背景图高460px 需要剧中显示 该控件420px带边框*/
    padding: 20px 0;
    list-style-type: none;
    border: 1px solid #ff6700;
    color: #424242;
    background: #fff
}

/*设置背景*/
.site-category-list .title {
    position: relative;
    display: block;
    padding-left: 30px;
    /*共十条 总共高度420 单条42px*/
    height: 42px;
    line-height: 42px;
    color: #424242
}

.site-category-list-custom .title {
    color: #fff
}

.site-category-list-custom {
    height: 420px;
    border: 0;
    color: #fff;
    background: rgba(105, 101, 101, .6)
}

/*搜索样式*/
.header-search {
    float: right;
    width: 296px;
    /*总共高度100px  搜索框50px所以据上面25px*/
    margin-top: 25px
}

.search-form {
    position: relative;
    width: 296px;
    height: 50px;
    z-index: 20
}

.search-btn {
    right: 0;
    z-index: 2;
    width: 52px;
    height: 50px;
    font-size: 24px;
    line-height: 24px;
    background: #fff;
    color: #616161
}

.search-text {
    right: 51px;
    z-index: 1;
    width: 223px;
    height: 48px;
    padding: 0 10px;
    font-size: 14px;
    line-height: 48px
}

.search-btn, .search-text {
    position: absolute;
    top: 0;
    border: 1px solid #e0e0e0;
    outline: 0;
}

.span4, .span16 {
    float: left;
}

.span4 {
    width: 234px
}

.span16 {
    margin-left: 14px;
    min-height: 1px;
    width: 978px;
}

/*通道*/
/*六个小按钮*/


.home-hero {
    position: relative;
    height: 184px;

}

.home-hero .home-hero-sub {
    margin-top: 14px
}

.home-channel-list {
    margin: 0;
    padding: 3px;
    list-style-type: none;
    font-size: 12px;
    text-align: center;
    background: #5f5750
}

.home-channel-list li {
    position: relative;
    float: left;
    width: 70px;
    height: 82px;
    padding: 0 3px
}

.home-channel-list li:after, .home-channel-list li:before {
    position: absolute;
    content: "";
    background: #665e57
}

.home-channel-list li:before {
    top: -1px;
    left: 6px;
    width: 64px;
    height: 1px
}

.home-channel-list li:after {
    top: 6px;
    left: 0;
    width: 1px;
    height: 70px
}

.home-channel-list li.left:after, .home-channel-list li.top:before {
    display: none
}


.home-channel-list a {
    display: block;
    padding-top: 18px;
    text-overflow: ellipsis;
    color: #fff;
    opacity: .7;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.home-channel-list a:hover {
    opacity: 1
}

.home-channel-list img {
    display: block;
    width: 24px;
    height: 24px;
    margin: 0 auto 4px
}

.clearfix:after, .clearfix:before {
    content: " ";
    display: table
}

.clearfix:after {
    clear: both
}

/*促销*/
.home-promo-list li {
    float: left;
    width: 316px;
    height: 170px;
    margin-left: 15px;
}

/*将a标签和img标签转成块元素*/
.home-promo-list a {
    display: block;
    height: 170px;
}

.home-promo-list img {
    display: block;
    width: 316px;
    height: 170px
}

/*第一个需要清楚左边外边距15px否则装不下*/
.home-promo-list li.first {
    margin-left: 0
}


/*主要内容*/
.home-main {
    padding-top: 4px;
    display: block;
    padding-bottom: 12px;
}

.page-main {
    background: #f5f5f5;
}

.home-banner-box{
    margin: 22px 0;
}

.home-brick-box{
    width: 1226px;
}
.box-hd{
    height: 58px;
    background-color: white;
}
.box-hd h2{
    display: block;
    line-height: 58px;
    text-align: center;
    padding-left: 22px;
    float: left;
}
.more-link{
    float: right;
}
.more a{
    display: block;
    text-align: center;
    line-height: 58px;
    padding-right: 22px;
}
.brick-item a:hover{

}
.span16 .brick-list{
      background: #f5f5f5;

}
.brick-list{
    width: 992px;
    padding: 0;
}
.span16 .brick-list{
    margin-left: -14px;
}
.brick-list .brick-item{
    padding: 20px 0;
}
.figure{
    width: 160px;
    height: 160px;
    margin: 0 37px 18px;
}
.figure-img img{
display: block;
    width: 160px;
    height: 160px;
}
.brick-list li{
    float: left;
    width: 234px;
    height: 260px;
    margin-left: 14px;
    background-color: white;
    margin-bottom: 14px;
}
.brick-item h3, .brick-item p{
    text-align: center;
}
.col-links{
    float: left;
    width: 160px;
}
.nofollow{

}
.site-footer{
    padding: 40px 0;
}
.col-links dl{
    display: block;
}
.col-links dt{
    display: block;
    margin: -1px 0 26px;
    font-size: 14px;
    color: #424242;
}
.col-links dd{
    font-size: 12px;
    margin: 10px 0 0;
    display: block;
}